import React, { Component } from "react";

class Swiper extends Component {
  render() {
    return (
      <div>
        <div>轮播</div>
        <div>{this.props.children[0]}</div>
        <div>{this.props.children[1]}</div>
        <div>{this.props.children[2]}</div>
      </div>
    );
  }
}

class MyButton extends Component {
  buttonStyle = {
    primary: "blue",
    warning: "#000",
  };
  static defaultProps = {
    color: "primary",
  };
  render() {
    return (
      <div style={{ backgroundColor: this.buttonStyle[this.props.color] }}>
        {this.props.children}
      </div>
    );
  }
}

class App extends Component {
  render() {
    return (
      <div>
        <Swiper>
          <div>23423423432</div>
          <div>2423432</div>
          <div>123</div>
        </Swiper>
        <MyButton color="warning">提交</MyButton>
      </div>
    );
  }
}

export default App;
